<template>
  <div class="show-room"></div>
</template>

<script>
  import store from '@/store';

  import api from '@/../public/api.js';
  export default {
    name: 'showRoom',
    components: {},
    props: {},
    data() {
      return {
        api: api,
        basicDraw: null,
        model: null,
      };
    },
    computed: {},
    watch: {},
    created() {
      let { data_id, type } = this.$route.query;
      let {
        BasicDraw,
        ModelShowroom,
        PanoramaShowroom,
        // BigImageShow, // 大图类
      } = require('../../../utils/main');
      // 显示大图 new BigImageShow().showBigImg(大图id)

      this.basicDraw = new BasicDraw(); // 创建基础渲染类
      this.basicDraw.start(); // 开始渲染
      let modelType = type == '3D' ? ModelShowroom : PanoramaShowroom;
      this.model = new modelType(data_id, true, {
        // 创建3D模型展厅并渲染，参数：展厅ID、是否调试、基础请求配置
        baseUrl: api.apiOther + '/',
        bigImageUrl: api.apiMap + '/',
        ak: store.getters.token,
      });
      this.$message({ message: '如想退出展厅，请按ESC键！', type: 'info', duration: 6000 });
      window.addEventListener('keydown', this.monitor);
    },
    destroyed() {
      window.removeEventListener('keydown', this.monitor);
    },
    methods: {
      monitor(e) {
        if (e.key == 'Escape') {
          this.model?.dispose();
          this.model = null;
          this.basicDraw?.dispose();
          this.basicDraw = null;
          this.$router.back();
        }
      },
    },
  };
</script>

<style scoped lang="less"></style>
